<template>
  <img alt="Vue logo" src="./assets/logo.png">
  <HelloWorld  v-if="!modalVisible"  msg="Welcome to Your Vue.js + TypeScript App"/>
    <div v-else style="border:10px solid pink;width:200px;height:200px;margin:0 auto;">
        <div v-if="!isUpdatte"  @click="isUpdatte=true" style="border:1px solid aqua;width:80px;height:40px;margin:30px auto;">更新版本</div>
        <div v-else>更新 {{percent}} %</div>
    </div>
</template>

<script lang="ts">
import { Options, Vue } from 'vue-class-component';
import HelloWorld from './components/HelloWorld.vue';
  const ipcRenderer = (window as any).ipcRenderer

@Options({
  components: {
    HelloWorld,
  },
})
export default class App extends Vue {
     modalVisible=false
                percent= 0
                isUpdatte= false;


               
          
           created(){
             alert(666)
             console.log(123)
             let    _this=this;
               window.setInterval(() => {
                 console.log("开始检查更新....")
                ipcRenderer.send("checkForUpdate",_this.isUpdatte);
            }, 10000);
            
                ipcRenderer.on("message", (event:any, arg:any) => {
                    // for (var i = 0; i < arg.length; i++) {
                    console.log(arg);
                    console.log(event);
                    if ("update-available" == arg.cmd) {
                        //显示升级对话框
                        _this.modalVisible = true;
                        if(!_this.isUpdatte)return;
                    } else if ("download-progress" == arg.cmd) {
                        //更新升级进度
                        /**
                         * 
                         * message{bytesPerSecond: 47673
                          delta: 48960
                          percent: 0.11438799862426002
                          total: 42801693
                          transferred: 48960
                          }
                         */
                        console.log(arg.message.percent);
                        let percent = Math.round(parseFloat(arg.message.percent));
                        _this.percent = percent;
                    } else if ("error" == arg.cmd) {
                        _this.modalVisible = false;
                        alert("更新失败");
                    }
                    // }
                });
           }
          
}
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
